import React, { Component } from 'react';
import NavigationBar from '../../Common/NavigationBar/NavigationBar.jsx'
import RegisterItem from '../../Common/RegisterLoginItem/RegisterLoginItem.jsx';
//import Using ES6 syntax
import WeUI from 'react-weui';

//import styles
import 'weui';
import 'react-weui/build/dist/react-weui.css';
import {CSS} from '../styles/Register.css'
const {Toptips} = WeUI;
export default class  SetRegisterPassword extends Component{
    constructor(props){
        super(props);
        this.LeftClick = this.LeftClick.bind(this);
        this.registerFinish = this.registerFinish.bind(this);
        this.ToLogin = this.ToLogin.bind(this);
    }
    componentWillMount(){ //组件即将被插入
        this.state = {
            data: {
                title:"注册",
                describe:"设置您的密码",
                inputName1:"设置密码",
                inputName2:"再次输入密码",
                messagesCodeTitle:"",
                forgetPassword:"",
                buttonTitle:"完成注册",
                type:"password",
                phoneNumType:"password",
                showWarn: false,
                warnTimer: null,
                tipText: "",
            }
        };
        this.state.warnTimer && clearTimeout(this.state.warnTimer);
    }
    showWarn(text) {
        this.setState({showWarn: true, tipText: text});

        this.state.warnTimer = setTimeout(()=> {
            this.setState({showWarn: false});
        }, 2000);
    }
    LeftClick(){
    }
    ToLogin(){
        location.hash="/Login";
    }
    login(phoneNum,password){
        let self=this;
        let fromData = new FormData();
        fromData.append("mobile",phoneNum)
        fromData.append("password",password)
        fetch(getHost() + "/user/login", {
            method: 'POST',
            credentials: 'include',
            body: fromData
        }).then(response => response.json()).then(json => {
            if (json.success) {
                console.log(json)
                self.showWarn("登录成功");
                markDataRequestFlag();
                location.hash="/TeamList";
            } else {
                self.showWarn("登录失败")
                console.log(json.error)
            }
        }).catch(e =>{
            console.log("网络出现了点问题：" + e);
        });
    }
    registerFinish(password1,password2){
        let self=this;
        let phoneNum = this.props.location.query.phoneNum;
        console.log("注册页面",phoneNum);
        //判断两次密码是否相同
        if(password1 != password2){
            this.showWarn("输入密码不同");
            return false
        }else if(!password1||!password2){
            this.showWarn("请先输入完整信息");
            return false
        }
        //完成注册
        let fromData = new FormData();
        fromData.append("mobile",phoneNum)
        fromData.append("password",password1)
        fetch(getHost() + "/user/register", {
            method: 'POST',
            credentials: 'include',
            body: fromData
        }).then(response => response.json()).then(json => {
            if (json.success) {
                self.showWarn("注册成功")
                this.login(phoneNum,password1);
            } else {
                self.showWarn("注册失败")
            }
        }).catch(e =>{
            console.log("网络出现了点问题：" + e);
        });
    }
    render(){
        return(
            <div>
                <NavigationBar Title="注册" LeftBar="true" LeftTitle="返回"
                               LeftIconSrc="/iot-meeting/assets/images/common/nav_back_icon.png" LeftClick={this.LeftClick}/>
                <RegisterItem data={this.state.data} callbackParent={this.registerFinish}/>
                <div className="RegisterAccountDiv">已有账号?<span style={{color:"#0088EC"}} onClick={this.ToLogin}>登录</span></div>
                <Toptips type="warn" show={this.state.showWarn}>{this.state.tipText}</Toptips>
            </div>
        )
    }
}
//属性默认值
SetRegisterPassword.defaultProps = {

};

//属性
SetRegisterPassword.propTypes = {

};